<template>
  <div>
    <p>今日温度{{ num }}</p>
    <p>建议穿{{ msg }}</p>
    <button @click="up">升温</button>
    <button @click="down">降温</button>
  </div>
</template>
<script>
export default {
  data() {
    return {
      num: 1,
      msg: '棉袄'
    }
  },
  methods: {
    up() {
      this.num += 5
    },
    down() {
      this.num -= 5
    }
  },
  watch: {
    //监听的变量 新数据 旧数据
    num(newVal, oldVal) {
      console.log(newVal, oldVal);
      if (newVal < 10) {
        this.msg = '棉袄'
      } else if (newVal < 25 && newVal > 10) {
        this.msg = '短袖'
      } else {
        this.msg = '这天也贼热了'
      }
    }
  }
}
</script>
<style></style>
